
<ion-content style="background-color: #eee;">
    <div class="slide-img">
	    <ion-slides #slider pager autoplay="2000" loop="true" (ionSlideDidChange)="onSlideChanged()" dir="ltr">
	      <ion-slide *ngFor="let slide of slides" [ngStyle]="{'background':'url(' +slide.imageUrl+')'}">
	       <h2 style="color:white;">{{slide.title}}</h2>
	      </ion-slide>
	    </ion-slides>
	</div>	
 	<div class="classify">
    	<div class="myGrid">
      	<ion-grid>
        	<ion-row>
          		<ion-col col-3>
            		<ion-icon name="md-archive" color="beauty1"></ion-icon>
		        </ion-col>
		        <ion-col col-3>
		            <ion-icon name="heart" color="beauty4"></ion-icon>
		        </ion-col>
		        <ion-col col-3>
		            <ion-icon name="md-pie" color="beauty2"></ion-icon>
		        </ion-col>
	          	<ion-col col-3>
	            	<ion-icon name="notifications" color="energized"></ion-icon>
	          	</ion-col>
	        </ion-row>
	        <ion-row>
	          	<ion-col col-3>
	            	<span>最热</span></ion-col>
	          	<ion-col col-3>
	            	<span>最新</span></ion-col>
	          	<ion-col col-3>
	            	<span>直播</span></ion-col>
	          	<ion-col col-3>
	            	<span>分类</span></ion-col>
	        </ion-row>
      	</ion-grid>
    	</div>
  	</div>
  	<hr no-margin>
  	<!--编辑 精选-->
  	<div class="parts-sift">
    	<div class="sift-title">
      		<h4 text-center no-margin>编辑&nbsp;·&nbsp;精选</h4>
      		<hr class="short-hr" no-padding>
    	</div>
    	<ion-grid no-margin>
      	<ion-row>
        	<ion-col col-6 *ngFor="let item of items">
          		<div class="sift-col">
            		<img src={{item.imageUrl}} alt="tu">
            		<span class="sift-label">视频</span>
            		<div class="sift-words">
			            <p>{{item.title}}</p>
			            <span>{{item.num}}人观看</span>
            		</div>
          		</div>
       		</ion-col>
      	</ion-row>
    	</ion-grid>
  	</div>
	<!--为你推荐-->
  	<div class="parts-sift">
      	<div class="sift-title">
          	<h4 text-center no-margin>为你&nbsp;·&nbsp;推荐</h4>
          	<hr class="short-hr" no-padding>
        </div>
    	<ion-grid no-margin>
      		<ion-row>
        		<ion-col col-6>
          			<div class="sift-col">
			            <img src="assets/img/slide1.jpeg" alt="tu">
			            <span class="sift-label">视频</span>
			            <div class="sift-words">
			              	<p>别压抑,你需要释放</p>
              				<span>53463人观看</span>
            			</div>
          			</div>
        		</ion-col>
        		<ion-col col-6>
          			<div class="sift-col">
			            <img src="assets/img/slide2.jpeg" alt="tu">
			            <span class="sift-label">视频</span>
			            <div class="sift-words">
			              	<p>[经典名著选读]：俳句的颠覆</p>
			              	<span>53463人观看</span>
            			</div>
          			</div>
        		</ion-col>
      		</ion-row>
      		<ion-row>
        		<ion-col col-6>
          			<div class="sift-col">
            			<img src="assets/img/slide3.jpg" alt="tu">
            			<span class="sift-label">视频</span>
            			<div class="sift-words">
			              	<p>[经典名著选读]：俳句的颠覆</p>
			              	<span>53463人观看</span>
            			</div>
			        </div>
			    </ion-col>
			    <ion-col col-6>
			        <div class="sift-col">
			            <img src="assets/img/slide4.jpg" alt="tu">
			            <span class="sift-label">视频</span>
			            <div class="sift-words">
			              	<p>[经典名著选读]：俳句的颠覆</p>
			              	<span>53463人观看</span>
			            </div>
			        </div>
        		</ion-col>
      		</ion-row>
    	</ion-grid>
  	</div>

</ion-content>
